
menubar = function (id,backgroundColor) {
     
    var $_menubar = this;

    $_menubar.id = (id ? id : "menubar");
    $_menubar.backgroundColor = (backgroundColor ? backgroundColor : "silver");
    $_menubar.menu_clicked = 0;
   
   
   
    
    $_menubar.load = function () { 
       
        $("#" + $_menubar.id).css({
            clear:"both"
        })
        
        $("#" + $_menubar.id + "  ul").css({
            "list-style":"none",
            "padding": 0,
            "z-index" : 500
        });
        $("#" + $_menubar.id + "  li").css({
            
            "background-color": $_menubar.backgroundColor,
            cursor: "pointer"
        });
        
        $("#" + $_menubar.id + " li >  ul").css({"display":"none"});
        
        $("#" + $_menubar.id + " > ul > li").css({"float":"left","margin-right":"5px"});
        $("#" + $_menubar.id + "  li > ul ").css({
            "position":"absolute",
            "margin-left":"40px"});
        
        $("#" + $_menubar.id + " > ul > li").click(function() { 
            $(this).siblings().find("ul").hide("fast"); 
        });
        
        $("#" + $_menubar.id + " ul > li").click(function() {
            $(this).css({"background-color":"blue","color":"white"})
            $(this).siblings().css({"background-color":$_menubar.backgroundColor,color:"black"})
            $(this).siblings().children("ul").slideUp("fast");
            if ($_menubar.menu_clicked == 0) $(this).children("ul").slideDown();    
        });  
        
        $("#" + $_menubar.id + " li > ul > li").click(function() {
            $(this).css({"background-color":"blue","color":"white"})
            $(this).siblings().css({"background-color":$_menubar.backgroundColor})
            $(this).siblings().children("ul").hide("fast");
            if ($(this).has("ul").length == 0) {
                $("#" + $_menubar.id + " li ul").slideUp();   
                $_menubar.menu_clicked = 1;
                setTimeout(function () {$_menubar.menu_clicked = 0}, 100);

            }
        });
        
        
    }; 
    
    
    $_menubar.initialize = function () {
        
        var productElement = document.getElementById($_menubar.id);
        if (productElement != null) $_menubar.load();
        else var t = setTimeout ($_menubar.initialize,100);
    }
    
    
   $_menubar.initialize ();
    
}